<template>
	<view class="cash page bgf5 pt10 px14">
		<view class="flex flexC flexB bgff r6 p16" v-if="currentType != 'alipay'">
			<text class="fs16">银行卡：</text>
			<view class="flex flexC" v-if="card != null" @click="addbank">
				<view class="flex flexC">
					<view class="mx10">{{card.card_num}}({{card.bank_name}})</view>
				</view>
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>
		<view class="flex flexC flexB bgff r6 p16" v-else>
			<text class="fs16">支付宝：</text>
			<view @click="$refs.bankPopup.open()" class="flex flexC">
				<view v-if="alipay != null" class="flex flexC">
					<u-image src="/static/imgs/icons/alipay.png" width="40rpx" height="40rpx"></u-image>
					<view class="mx10" v-if="alipay != null">{{alipay.account}}</view>
				</view>
				<u-icon name="arrow-right" size="12"></u-icon>
			</view>
		</view>


		<view class="bgff r6 p16 mt10">
			<view class="fs18">提现金额(元)</view>
			<view class="bold6 flex flexC mt40">
				<text class="fs18">￥</text>
				<input v-model="amount" type="number" class="borb fs30 pb4 h40 px10" />
			</view>
			<view class="mt16">可提现：￥{{balance}}</view>
			<view class="bgf8 py20 px16 mt28 c8e">
				<view class="flex flexS mb8">
					<text>提现时间：</text>
					<text class="flex1">周五 09:00-17:00</text>
				</view>
				<view class="flex flexS mb8" v-if="type == agent">
					<text>提现规则：</text>
					<text class="flex1">100元的倍数，6%的手续费</text>
				</view>
				<view class="flex flexS">
					<text>到账时间：</text>
					<text class="flex1">(T+1)天18：00前，周六周日节假不提现</text>
				</view>
			</view>
		</view>



		<button hover-class="none" @click="withdraw" class="bg41 btn r40 mt40 mx20 ">确认提现</button>
		<view class=" r40 aliC mx20 py15" @click="withList">提现记录</view>
		<uni-popup type="center" ref="bankPopup">
			<view class="bgff box w-15 r6 pt16 flex flexC flexJC flexCol">
				<view class="fs16 bold6">银行卡添加</view>
				<view class="mt18 px16">
					<text>请先添加银行卡，添加银行卡银行，才能提现</text>
					<text class="cf2"></text>
				</view>
				<view class="flex flexC bort aliC w-20 mt18">
					<text @click="$refs.bankPopup.close()" class="flex1 borr py12 c66">取消</text>
					<text class="flex1 py12 cf2" @click="addCard">添加</text>
				</view>
			</view>
		</uni-popup>

		<uni-popup type="center" ref="popup">
			<view class="bgff box w-15 r6 pt16 flex flexC flexJC flexCol">
				<view class="fs16 bold6">实名认证</view>
				<view class="mt18 px16">
					<text>请先做实名认证，做完实名认证以后，才能添加结算信息</text>
					<text class="cf2"></text>
				</view>
				<view class="flex flexC bort aliC w-20 mt18">
					<text @click="$refs.popup.close()" class="flex1 borr py12 c66">取消</text>
					<text class="flex1 py12 cf2" @click="doVerify">认证</text>
				</view>
			</view>
		</uni-popup>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				balance: '',
				card: null,
				alipay: null,
				currentType: 'bank',
				amount: '',
				verify: -1,
				is_with: 1,
				type: 'shop',
				name:''
			};
		},
		onLoad() {

		},
		onShow() {

			this.init();
		},
		methods: {
			
			addCard(){
				this.$refs.bankPopup.close();
				
				uni.navigateTo({
					url:'../member/addDeposit?name='+this.name
				})
			},

			addbank() {

				uni.navigateTo({
					url: '../member/addDeposit'
				})
			},

			withList() {
				uni.navigateTo({
					url: '../member/withList'
				})
			},

			doVerify() {
				this.$refs.popup.close();
				uni.navigateTo({
					url: '../member/realname'
				})
			},

			withdraw() {


				let that = this;

			
				let param = {
					amount: this.amount,
				};

				this.$api.doShopWithDraw(param).then(res => {

					console.info(res);
					if (res.code == 1) {

						uni.navigateBack({
							delta: 1
						})

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});

					}

				})
			},

			selectType(type) {
				this.$refs.bankPopup.close();
				console.info("==select Type verify==" + this.verify);
				if (this.verify != 1) {
					this.$refs.popup.open();
					return;
				}
				this.currentType = type;
				if (type == 'alipay') {
					if (this.alipay == null) {

						uni.navigateTo({
							url: '../cashout/addAlipay'
						})
					}
				} else if (type == 'bank') {
					if (this.card == null) {

						uni.navigateTo({
							url: '../bank/addDeposit'
						})
					}
				}

			},

			init() {
				let that = this;
				let param = {
					role:uni.getStorageSync("role")
				};
				this.$api.configInit(param).then(res => {

					console.info(res);
					if (res.code == 1) {
						that.balance = res.data.balance;
						that.card = res.data.card;
					} else if (res.code == -2) {

						if (that.verify != 1) {
							that.$refs.popup.open();
						}
					} else if (res.code == -3) {
						that.name = res.data.username;
						this.$refs.bankPopup.open();
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}

				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		margin: 0 auto;
	}

	.h40 {
		height: 80rpx;
	}

	.btn {
		line-height: 80rpx;
	}

	.bgf5 {

		background: #F5F5F5;
	}

	image {
		width: 32rpx;
	}

	.bgf8 {
		background-color: #F8F9FD;
	}

	.list {
		max-height: 70vh;
		overflow-y: auto;
	}
</style>
